<%--
    Document   : Add_Products
    Created on : 18/08/2010, 09:49:39 ص
    Author     : Ahmed
--%>
<%@include file="parts/Header.jsp"%>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">

<html>
    <head><link rel="stylesheet" type="text/css" href="Styles/adminStyle.css">
        <script type="text/javascript" src="Scripts/script.js"></script>

        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

        <title>Products</title>

        <link rel="stylesheet" type="text/css" href="styles/images/style.css">
        <!-- markItUp! skin -->
        <link rel="stylesheet" type="text/css" href="styles/markitup/skins/markitup/style.css">
        <!--  markItUp! toolbar skin -->
        <link rel="stylesheet" type="text/css" href="styles/markitup/sets/default/style.css">
        <!-- jQuery -->
        <script type="text/javascript" src="http://code.jquery.com/jquery-1.8.0.min.js"></script>
        <!-- markItUp! -->
        <script type="text/javascript" src="styles/markitup/jquery.markitup.js"></script>
        <!-- markItUp! toolbar settings -->
        <script type="text/javascript" src="styles/markitup/sets/default/set.js"></script>




        <link rel="stylesheet" type="text/css" href="styles/build/menu/assets/skins/sam/menu.css" />
        <link rel="stylesheet" type="text/css" href="styles/build/button/assets/skins/sam/button.css" />
        <link rel="stylesheet" type="text/css" href="styles/build/fonts/fonts-min.css" />
        <link rel="stylesheet" type="text/css" href="styles/build/container/assets/skins/sam/container.css" />
        <link rel="stylesheet" type="text/css" href="styles/build/editor/assets/skins/sam/editor.css" />
        <script type="text/javascript" src="styles/build/yahoo-dom-event/yahoo-dom-event.js"></script>
        <script type="text/javascript" src="styles/build/animation/animation-min.js"></script>
        <script type="text/javascript" src="styles/build/element/element-beta-min.js"></script>
        <script type="text/javascript" src="styles/build/container/container-min.js"></script>
        <script type="text/javascript" src="styles/build/menu/menu-min.js"></script>
        <script type="text/javascript" src="styles/build/button/button-min.js"></script>
        <script type="text/javascript" src="styles/build/editor/editor-min.js"></script>




    </head>
    <body class="yui-skin-sam">

        <br/>
        <br/><br/><br/><br/><br/><br/><br/><br/>






        <form method="post" action="#" id="form1">
            <textarea id="editor" name="editor" rows="20" cols="75">
This is some more test text.<br>This is some more test text.<br>This is some more test text.<br>This is some more test text.<br>This is some more test text.<br>This is some more test text.<br>This is some more test text.<br>
            </textarea>
        </form>

        <script>

            (function() {
                var Dom = YAHOO.util.Dom,
                Event = YAHOO.util.Event;
    
                YAHOO.log('Create Button Control (#toggleEditor)', 'info', 'example');
                var _button = new YAHOO.widget.Button('toggleEditor');
                _button.addClass('toggleEditor');

                var myConfig = {
                    height: '300px',
                    width: '600px',
                    animate: true,
                    dompath: true,
                    focusAtStart: true
                };

                var state = 'on';
                YAHOO.log('Set state to on..', 'info', 'example');

                YAHOO.log('Create the Editor..', 'info', 'example');
                var myEditor = new YAHOO.widget.Editor('editor', myConfig);
                myEditor.render();

                _button.on('click', function(ev) {
                    Event.stopEvent(ev);
                    if (state == 'on') {
                        YAHOO.log('state is on, so turn off', 'info', 'example');
                        state = 'off';
                        myEditor.saveHTML();
                        YAHOO.log('Save the Editors HTML', 'info', 'example');
                        var stripHTML = /<\S[^><]*>/g;
                        myEditor.get('textarea').value = myEditor.get('textarea').value.replace(/<br>/gi, '\n').replace(stripHTML, '');
                        YAHOO.log('Strip the HTML markup from the string.', 'info', 'example');
                        YAHOO.log('Set Editor container to position: absolute, top: -9999px, left: -9999px. Set textarea visible', 'info', 'example');
                        Dom.setStyle(myEditor.get('element_cont').get('firstChild'), 'position', 'absolute');
                        Dom.setStyle(myEditor.get('element_cont').get('firstChild'), 'top', '-9999px');
                        Dom.setStyle(myEditor.get('element_cont').get('firstChild'), 'left', '-9999px');
                        myEditor.get('element_cont').removeClass('yui-editor-container');
                        Dom.setStyle(myEditor.get('element'), 'visibility', 'visible');
                        Dom.setStyle(myEditor.get('element'), 'top', '');
                        Dom.setStyle(myEditor.get('element'), 'left', '');
                        Dom.setStyle(myEditor.get('element'), 'position', 'static');
                    } else {
                        YAHOO.log('state is off, so turn on', 'info', 'example');
                        state = 'on';
                        YAHOO.log('Set Editor container to position: static, top: 0, left: 0. Set textarea to hidden', 'info', 'example');
                        Dom.setStyle(myEditor.get('element_cont').get('firstChild'), 'position', 'static');
                        Dom.setStyle(myEditor.get('element_cont').get('firstChild'), 'top', '0');
                        Dom.setStyle(myEditor.get('element_cont').get('firstChild'), 'left', '0');
                        Dom.setStyle(myEditor.get('element'), 'visibility', 'hidden');
                        Dom.setStyle(myEditor.get('element'), 'top', '-9999px');
                        Dom.setStyle(myEditor.get('element'), 'left', '-9999px');
                        Dom.setStyle(myEditor.get('element'), 'position', 'absolute');
                        myEditor.get('element_cont').addClass('yui-editor-container');
                        YAHOO.log('Reset designMode on the Editor', 'info', 'example');
                        myEditor._setDesignMode('on');
                        YAHOO.log('Inject the HTML from the textarea into the editor', 'info', 'example');
                        myEditor.setEditorHTML(myEditor.get('textarea').value.replace(/\n/g, '<br>'));
                    }
                });
            })();
        </script>


        <textarea id="markItUp" cols="80"  rows="20">
        </textarea>

        <script type="text/javascript">
            $(function() {
                $('#markItUp').markItUp(mySettings);
	
                $('.add').click(function() {
                    $('#markItUp').markItUp('insert',
                    { 	openWith:'<opening tag>',
                        closeWith:'<\/closing tag>',
                        placeHolder:"New content"
                    }
                );
                    return false;
                });
	
                // And you can add/remove markItUp! whenever you want
                // $(textarea).markItUpRemove();
                $('.toggle').click(function() {
                    if ($("#markItUp.markItUpEditor").length === 1) {
                        $("#markItUp").markItUp('remove');
                        $("span", this).text("get markItUp! back");
                    } else {
                        $('#markItUp').markItUp(mySettings);
                        $("span", this).text("remove markItUp!");
                    }
                    return false;
                });
            });
        </script>




        <div style= "width:  50px;padding-top: 200px;padding-left: 20px" >
            <script src="styles/js/richtext.js" type="text/javascript" language="javascript"></script>
            <!-- Include the Free Rich Text Editor Variables Page -->
            <script src="styles/js/My_Configration.js" type="text/javascript" language="javascript"></script>
            <!-- Initialise the editor -->
            <script>
                initRTE('', 'styles/Styles/richText.css');
            </script>
        </div>
    </body>
</html>
